<template>
  <diy-container
    :status="pageStatus"
    headerBackGroudColor="#ffffff"
    :border-bottom="false"
    ref="container"
    title="心动专区"
    :headerVisable="true"
  >
    <view class="u-nav-slot" slot="navbarLeft" @click="navigation">
      <u-icon name="arrow-left" size="19"></u-icon>
    </view>
    <view class="member-container">
      <u-sticky bgColor="#fff" v-if="showTabs">
        <u-tabs :list="tabsList" class="tabs-box" :current="current" @change="tabsClick"></u-tabs>
      </u-sticky>
      <personal-information @dataInit="dataInit" @dataComplete="dataComplete" ref="informationRef" />
    </view>
  </diy-container>
</template>

<script>
import personalInformation from "components/personal-information/personal-information";
export default {
  components: { personalInformation },
  data() {
    return {
      current: 0,
	  showTabs:false,
      tabsList: [
        { name: "公务员", type: 1 },
        { name: "央企国区", type: 2 },
        { name: "高学历", type: 3 },
        { name: "教师", type: 4 },
        { name: "老板", type: 5 },
        { name: "背景好", type: 6 },
        { name: "亲戚好", type: 7 },
        { name: "车房有", type: 8 }
      ]
    };
  },
  mounted() {
	setTimeout(()=>{
		this.showTabs = true
	},300)
  },
  created() {},
  methods: {
    dataInit() {
      // 开始请求数据
      this.showPageLoading();
    },
    dataComplete() {
      // 请求数据完成
      this.showPageContent();
    },
    tabsClick(item) {
      this.current = item.index;
      this.$refs.informationRef.getData(item.type);
    },
    navigation() {
      uni.navigateBack({ delta: 1 });
    }
  }
};
</script>
